<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:c="http://java.sun.com/jsp/jstl/core">

<ui:composition
	template="#{webGlobal.url_template}/administration/main.xhtml">
	<ui:define name="head">

	</ui:define>

	<ui:define name="content">

		<div>
			<h:outputText id="infoStartTournament"></h:outputText>
			<h:message for="infoStartTournament" infoStyle="color: green;"
				errorStyle="color: red;" />
		</div>

			<div class="panel panel-default">
				<div class="panel-heading">
					<h:outputLabel value="#{adminView.tournament.name}"> - Liste des équipes</h:outputLabel>
				</div>

				<table class="table">
					<thead>
						<tr>
							<th>Nom</th>
						</tr>
					</thead>
					<tbody>
						<ui:repeat var="team" value="#{adminView.listTeams}">
							<tr>
								<td>#{team.name}</td>
							</tr>
						</ui:repeat>
						<tr></tr>
					</tbody>
				</table>
			</div>
			
			<div class="panel panel-default">
				<div class="panel-heading">
					<h:outputLabel value="#{adminView.tournament.name}"> - Liste des arbitres</h:outputLabel>
				</div>
	
				<table class="table table-hover">
					<thead>
						<tr>
							<th>Nom</th>
							<th>Prénom</th>
							<th>Match</th>
						</tr>
					</thead>
					<tbody>
						<ui:repeat var="referee" value="#{adminView.listReferee}">
							<tr>
								<td>#{referee.lastName}</td>
								<td>#{referee.firstName}</td>
								<td>#{referee.listMatchs.size()}</td>
							</tr>
						</ui:repeat>
						<tr></tr>
					</tbody>
				</table>
			</div>

		<h:panelGroup rendered="#{adminView.tournament.status == 'preparation'}">
			<h:form>
				<h:commandButton id="startTournament"
					action="#{adminView.startTournament()}"
					styleClass="btn btn-lg btn-primary btn-block"
					value="Démarrer tournoi">
				</h:commandButton>
			</h:form>
		</h:panelGroup>
		
		<h:panelGroup rendered="#{adminView.tournament.status != 'preparation'}">
			<div class="panel panel-default">
				<div class="panel-heading">
					<h:outputLabel value="#{adminView.tournament.name}"> - Liste des matchs</h:outputLabel>
				</div>
	
				<table class="table table-hover">
					<thead>
						<tr>
							<th>Tour</th>
							<th>Match</th>
							<th>Domicile</th>
							<th>Exterieur</th>
							<th>Status</th>
							<th>Score</th>
							<th>Action</th>
						</tr>
					</thead>
					<tbody>
						<ui:repeat var="match" value="#{adminView.listMatchsSorted}">
							<tr>
								<td>#{match.roundNumber}</td>
								<td>#{match.matchNumber}</td>
								<td>#{match.homeTeam.name}</td>
								<td>#{match.outsideTeam.name}</td>
								<td>#{match.status}</td>
								<td>#{match.scoreHome} - #{match.scoreOutside}</td>
								<td>
									<h:panelGroup rendered="#{match.status != 'terminated'}">
										<h:form prependId="false">
											<h:commandButton action="#{adminView.editMatch(match)}"
											image="#{webGlobal.url_module}/tournament/img/edit-icon.png"
											style="height: 20px; width: 20px; vertical-align: top;"/>
										</h:form>
									</h:panelGroup>
								</td>
							</tr>
						</ui:repeat>
						<tr></tr>
					</tbody>
				</table>
			</div>
		</h:panelGroup>
		
		<div id="treeTournament"></div>

		<script type="text/javascript">			
			var treeString = JSON.stringify(#{adminView.tournamentTree});
			var tree = JSON.parse(treeString);
			
			$(function() {
				$('#treeTournament').bracket({
					init : tree
				});
			});
		</script>

	</ui:define>
</ui:composition>
</html>